<template>
  <div>
    <button @click="headlejian">渐渐</button>
    <h2>{{ $store.state.sum }}</h2>
    <!-- 数组对象去重 -->
    <h2>数组对象</h2>
    <div v-for="item in List" :key="item.id" @click="headleAdd(item)">
      {{ item.location }}
    </div>
    <br />
    <hr />
    <div>
      <div v-for="item in checkList" :key="item.id">
        {{ item.location }} {{ item.state }}
      </div>
    </div>

    <nav-header>
      <!-- <span>1111111111</span>
      <span>11111111112222222222222222</span> -->
      <template slot="demo">
        <div>11111111111</div>
      </template>
      <template slot="tset1">
        <div>1111111111111111</div>
        <a href=""></a>
      </template>
    </nav-header>

    <Footer />
    <button @click="headleNav">跳转到goods</button>
    <Midd />
  </div>
</template>
<script>
import NavHeader from "../components/NavHeader.vue";
import Footer from "../components/Footer.vue";
import Midd from "../components/Midd.vue";
export default {
  components: { NavHeader, Footer, Midd },
  name: "home",
  data() {
    return {
      List: [
        {
          id: 0,
          location: "同省",
          state: true,
        },
        {
          id: 1,
          location: "同市",
          state: false,
        },
        {
          id: 2,
          location: "不限",
          state: false,
        },
      ],
      checkList: [],

      arr: [1, 2, 3, 5, 4],
      arr1: [],
      checkArr: [],
    };
  },

  mounted() {
    for (let i = 0; i < this.arr.length; i++) {
      if (this.arr[i] > 2) {
        this.arr1.push(this.arr[i]);
      }
    }
    console.log(this.arr1);

    // function uniqueEasy(arr) {
    //   if (!arr instanceof Array) {
    //     throw Error("当前传入的不是数组");
    //   }
    //   let list = [];
    //   let obj = {};
    //   arr.forEach((item) => {
    //     if (!obj[item]) {
    //       list.push(item);
    //       obj[item] = true;
    //     }
    //   });
    //   return list;
    // }
    // console.log(
    //   uniqueEasy(this.arr)
    //     .sort()
    //     .reverse()
    // );
  },
  methods: {
    headleAdd(item) {
      // this.checkList.push(item);
      // this.checkList = [...new Set(this.checkList)];

      // if(this.checkList.find(state=>state.id===item.id)!==undefined){
      //   this.checkList.splice(this.checkList.findIndex(state=>state.id===item.id),1)
      // }
      // this.checkList.push(item);
      // if (this.checkList.indexOf(item) !== -1) {
      //   this.checkList.splice(this.checkList.indexOf(item), 1);
      // }
      // this.checkList.push(item);

      if (this.checkList.forEach((state) => state === item)) {
        console.log(41111);
      }
      this.checkList.push(item);
    },

    headlejian() {
      this.$store.dispatch("jian", 10);
    },

    headleNav() {
      this.$router.push("/goods");
    },
  },
};
</script>
<style lang="less">
div {
  h2 {
    color: red;
  }
}
</style>
